{extend name="public/base" /}

{block name="content"}
<style>
    .pagination{
        margin-top: 0;
        margin-bottom: 0;
    }
</style>
<div class="wrapper wrapper-content">
    <div class="row">
        <div class="col-lg-12">
            <div class="ibox float-e-margins">
                <div class="ibox-content">
                    <div class="pull-left">
                        <a class="btn btn-sm btn-primary modal-create">添加</a>
                        <a class="btn btn-sm btn-danger deletes">删除</a>
                    </div>
                    <table class="table table-bordered table-hover">
                        <thead>
                        <tr>
                            <th width="8%">
                                <input type="checkbox" id="all" class="i-checks total-checkbox"> <label for="all">全选</label>
                            </th>
                            <th>ID</th>
                            <th>名称</th>
                            <th>路由</th>
                            <th>添加时间</th>
                            <th>操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        {empty name='list'}
                        <tr align="center">
                            <td colspan="6">
                                暂时没有数据哦
                            </td>
                        </tr>
                        {else /}
                        {foreach $list as $k=>$item}
                        <tr id="del-{$item.id}">
                            <td>
                                <input name="ids[]" value="{$item.id}" type="checkbox" class="i-checks item-checkbox">
                            </td>
                            <td>
                                {$item.id}
                            </td>
                            <td>
                                <a > {$item.name}</a>
                            </td>
                            <td>{$item.route}</td>
                            <td>{$item.create_time}</td>
                            <td>
                                <a href="/admin/permission/{$item.id}" title="编辑" class="btn btn-outline btn-xs btn-info modal-item"><i class="fa fa-edit"></i></a>
                                <a href="/admin/permission/{$item.id}" data-id="{$item.id}" title="删除" class="btn btn-outline btn-xs btn-danger delete"><i class="fa fa-trash"></i></a>

                            </td>
                        </tr>
                        {/foreach}
                        {/empty}
                        </tbody>
                    </table>
                    {$list|raw}
                </div>
            </div>
        </div>
    </div>
</div>
<div id="modal-form" class="modal fade" aria-hidden="true">
    <div class="modal-dialog" style="width:400px">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times;</button>
                <h4 class="modal-title" id="myModalLabel">添加权限</h4>
            </div>
            <div class="modal-body">
                <form class="form-horizontal add-admin-form" role="form">
                    <div class="form-group">
                        <label for="name" class="col-sm-4 control-label">名称 <font color="red">*</font></label>
                        <div class="col-sm-8">
                            <input type="text" autocomplete="off" class="menu-common form-control" id="name" name="name" placeholder="请输入名称">
                            <span></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="route" class="col-sm-4 control-label">上级<font color="red">*</font></label>
                        <div class="col-sm-8">
                            <select name="parent_id" id="pid" class="form-control">
                                <option value="0">顶级</option>
                                {foreach $data as $k=>$v}
                                <option value="{$v['id']}" data-level="{$v['level']}">{$v['name']}</option>
                                {if !empty($v['child'])}
                                    {foreach $v['child'] as $kk=>$va}
                                    <option value="{$va['id']}">{$va['level']|repeat}{$va['name']}</option>
                                    {/foreach}
                                {/if}
                                {/foreach}
                            </select>
                            <span></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="route" class="col-sm-4 control-label">路由 <font color="red">*</font></label>
                        <div class="col-sm-8">
                            <input type="text" autocomplete="off" class="menu-common form-control" id="route" name="route" placeholder="控制器/方法">
                            <span></span>
                        </div>
                    </div>
                    <div class="form-group">
                        <label for="desc" class="control-label col-sm-4">描述</label>
                        <div class="col-sm-8">
                            <textarea name="desc" autocomplete="off" class="form-control" rows="3"></textarea>
                        </div>
                    </div>
                    <div class="form-group">
                        <div class="pull-right" style="margin-right:8px;">
                            <button data-style="zoom-in" type="button" data-id="0" class="ladda-button btn btn-primary add-admin">保存</button>
                        </div>
                    </div>
                    <div class="alert alert-danger hide error-info "></div>
                </form>
            </div>
        </div>
    </div>
</div>
{/block}

{block name="js"}
<script>
    $(function(){

        delete_data('/admin/deletepermission');

        delete_one();

        // 显示错误/正确提示
        $('.menu-common').blur(function(){
            if ($(this).val() == '') {
                $(this).parent().parent().addClass('has-error');
            }else{
                $(this).parent().parent().removeClass('has-error');
            }
        });

        hide_model(['name','desc']);

        $('.add-admin').click(function(){
            var l;

            var id = $(this).attr('data-id');
            var params = $('.menu-common').length;
            for (var i = 0; i < params; i++) {
                if ($('.menu-common').eq(i).val()=='') {
                    $('.menu-common').eq(i).parent().parent().addClass('has-error');
                    $('.menu-common').eq(i).focus();
                    var flag = false;
                    break;
                }else{
                    $('.menu-common').eq(i).parent().parent().removeClass('has-error');
                    var flag = true;
                }
            }
            if (parseInt(id) !== 0) {
                // 修改
                var data = $('.add-admin-form').serialize();
                var post_url = '/admin/permission/'+id;
                var type = 'PUT';
            }else{
                // 新增
                var data = $('.add-admin-form').serialize();
                var post_url = '/admin/permission';
                var type = 'POST';
            }
            if (flag){
                l = Ladda.create(this);
                l.start();
                $.ajax({
                    url: post_url,
                    data: data,
                    type: type,
                    dataType: 'json',
                    success: function(res){
                        if (res.code == 0){
                            $('.error-info').removeClass('hide').text(res.msg);
                        }else{
                            $('#modal-form').modal('hide');
                            alertMsg(res.msg);
                        }
                        l.stop();
                    }
                });
            }
        });

        // 显示内容
        $('.modal-item').click(function(){
            var url = $(this).attr('href');
            if ($(this).hasClass('modal-create')) {
                var title = '添加权限';
            }else{
                var title = '编辑权限';
            }
            $.get(url,{},function(res){
                if(res.code==1){
                    showModal1('modal-form',res.data,title,'add-admin');
                }else{
                    alertMsg(res.msg,'warning',false);
                }
            },'json');
            return false;
        });

        $('.modal-create').click(function(){
            $('#modal-form').modal('show').find('.modal-title').text('添加权限');
            $('textarea[name="desc"]').val('');
        });

        function showModal1(obj,data,title, btn = 'add-menu'){
            var modal = $('#'+obj);
            modal.find('.modal-title').text(title);
            modal.find('.'+btn).attr('data-id',data.id);
            for(item in data){
                var object = modal.find('[name="'+item+'"]');
                if (object.length > 0) {
                    if(item == 'parent_id'){
                        if(data[item] == 0){
                            $('#pid').find('option[value="0"]').attr('selected','selected');
                        }else{
                            $('#pid').find('option[value="'+data[item]+'"]').attr('selected','selected');
                        }
                    }else{
                        object.val(data[item]);
                    }
                }
            }
            modal.modal('show');
        }
    });
</script>
{/block}